<template>
  <div>
    <div>
      <!-- <el-button v-show="showSecond" class="mb20" @click="handleBack">返回</el-button> -->
      <!-- <el-button
        v-show="firstRow && firstRow.warningGrade === 3"
        :disabled="selectedRows.length === 0"
        type="danger"
        @click="handleMany"
        class="fr"
      >批量处置</el-button>-->
    </div>
    <first-table v-show="!showSecond" @showSecond="handleShowSecond" ref="firstTable" />
    <second-table
      @many="handleMany"
      @back="handleBack"
      @postEval="handlePostEval"
      @postArr="handlePostArr"
      @showAudit="handleShowAudit"
      @showDialog="handleShowDialog"
      v-show="showSecond"
      ref="secondTable"
    />
    <handle-dialog @refresh="handleRefresh" ref="handleDialog" />
    <audit-dialog @refresh="handleRefresh" ref="auditDialog" />
  </div>
</template>

<script>
import FirstTable from './FirstTable'
import SecondTable from './SecondTable'
import HandleDialog from './HandleDialog'
import AuditDialog from './AuditDialog'

import { handleWarning } from '@/api/prewarning'

export default {
  components: {
    FirstTable,
    SecondTable,
    HandleDialog,
    AuditDialog
  },
  data() {
    return {
      showSecond: false,
      firstRow: null,
      selectedRows: [],
      type: null
    }
  },
  methods: {
    handleShowDialog(row, arr, view, handle = false) {
      console.log('第二个表格点击传值', this.firstRow, row)

      this.$refs.handleDialog.edit(this.firstRow, arr, row, true, [], view, handle)
    },
    handleShowAudit(row) {
      this.$refs.auditDialog.edit(this.firstRow, row)
    },
    handlePostEval(arr) {
      if (arr && arr.length > 0) {
        this.warningRuleEvals = [...arr]
      }
    },
    handleRefresh() {
      this.$refs.secondTable.showSecond(this.firstRow, this.type)
      this.$refs.firstTable.handleGetList()
    },
    handleShowSecond(row, type) {
      console.log('row', row)

      this.showSecond = true
      this.type = type
      this.firstRow = Object.assign({}, row)
      this.$refs.secondTable.showSecond(row, type)
    },
    async handleGetList(param = {}) {
      this.loading = true
      this.queryParam = Object.assign(this.queryParam, param)
      const res = await areaList(this.queryParam)
      if (res.data && res.data.records.length > 0) {
        const {
          state,
          data: { records, total }
        } = res
        this.tableData = records
        this.total = total
      } else {
        this.tableData = []
        this.total = 1
      }
      this.loading = false
    },
    // 第二个表格多选传递出来的数组
    handlePostArr(arr) {
      this.selectedRows = [...arr]
    },
    // 批量处置
    handleMany() {
      this.selectedRows.map(v => {
        v.ruleId = this.firstRow.ruleId
      })
      this.$refs.handleDialog.edit(this.firstRow, this.warningRuleEvals, {}, false, this.selectedRows)
    },
    handleBack() {
      this.showSecond = false
    }
  }
}
</script>